<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>公共设施报修响应平台</title>
    <script src="https://cdn.tailwindcss.com"></script>
</head>

<body class="flex">
    <!-- 侧边栏 tab -->
    <div class="w-1/5 bg-gray-100 h-screen p-4">
        <h1 class="text-2xl font-bold mb-4">公共设施报修响应平台</h1>
        <ul class="space-y-2">
            <li><a href="#" class="block p-2 bg-blue-500 text-white rounded-md" onclick="openTab('repairRequest')">报修请求管理</a></li>
            <li><a href="#" class="block p-2 bg-gray-300 hover:bg-gray-400 rounded-md" onclick="openTab('repairman')">维修人员管理</a></li>
            <li><a href="#" class="block p-2 bg-gray-300 hover:bg-gray-400 rounded-md" onclick="openTab('facility')">设施信息管理</a></li>
            <li><a href="#" class="block p-2 bg-gray-300 hover:bg-gray-400 rounded-md" onclick="openTab('responseRecord')">响应记录管理</a></li>
            <li><a href="#" class="block p-2 bg-gray-300 hover:bg-gray-400 rounded-md" onclick="openTab('evaluation')">评价管理</a></li>
        </ul>
    </div>
    <!-- 主内容区域 -->
    <div class="w-4/5 p-4">
        <!-- 报修请求管理 -->
        <div id="repairRequest" class="tab-content">
            <h2 class="text-xl font-bold mb-2">报修请求管理</h2>
            <input type="text" id="repairRequestSearch" placeholder="搜索报修请求" oninput="searchRepairRequests()" class="border border-gray-300 p-1 mb-2">
            <button class="bg-green-500 text-white p-1 rounded-md" onclick="openAddRepairRequestModal()">添加报修请求</button>
            <table class="table-auto w-full">
                <thead>
                    <tr>
                        <th class="border border-gray-300 p-1">ID</th>
                        <th class="border border-gray-300 p-1">设施名称</th>
                        <th class="border border-gray-300 p-1">报修人</th>
                        <th class="border border-gray-300 p-1">报修时间</th>
                        <th class="border border-gray-300 p-1">操作</th>
                    </tr>
                </thead>
                <tbody id="repairRequestTable"></tbody>
            </table>
        </div>
        <!-- 维修人员管理 -->
        <div id="repairman" class="tab-content hidden">
            <h2 class="text-xl font-bold mb-2">维修人员管理</h2>
            <input type="text" id="repairmanSearch" placeholder="搜索维修人员" oninput="searchRepairmen()" class="border border-gray-300 p-1 mb-2">
            <button class="bg-green-500 text-white p-1 rounded-md" onclick="openAddRepairmanModal()">添加维修人员</button>
            <table class="table-auto w-full">
                <thead>
                    <tr>
                        <th class="border border-gray-300 p-1">ID</th>
                        <th class="border border-gray-300 p-1">姓名</th>
                        <th class="border border-gray-300 p-1">联系方式</th>
                        <th class="border border-gray-300 p-1">操作</th>
                    </tr>
                </thead>
                <tbody id="repairmanTable"></tbody>
            </table>
        </div>
        <!-- 设施信息管理 -->
        <div id="facility" class="tab-content hidden">
            <h2 class="text-xl font-bold mb-2">设施信息管理</h2>
            <input type="text" id="facilitySearch" placeholder="搜索设施信息" oninput="searchFacilities()" class="border border-gray-300 p-1 mb-2">
            <button class="bg-green-500 text-white p-1 rounded-md" onclick="openAddFacilityModal()">添加设施信息</button>
            <table class="table-auto w-full">
                <thead>
                    <tr>
                        <th class="border border-gray-300 p-1">ID</th>
                        <th class="border border-gray-300 p-1">设施名称</th>
                        <th class="border border-gray-300 p-1">位置</th>
                        <th class="border border-gray-300 p-1">操作</th>
                    </tr>
                </thead>
                <tbody id="facilityTable"></tbody>
            </table>
        </div>
        <!-- 响应记录管理 -->
        <div id="responseRecord" class="tab-content hidden">
            <h2 class="text-xl font-bold mb-2">响应记录管理</h2>
            <input type="text" id="responseRecordSearch" placeholder="搜索响应记录" oninput="searchResponseRecords()" class="border border-gray-300 p-1 mb-2">
            <button class="bg-green-500 text-white p-1 rounded-md" onclick="openAddResponseRecordModal()">添加响应记录</button>
            <table class="table-auto w-full">
                <thead>
                    <tr>
                        <th class="border border-gray-300 p-1">ID</th>
                        <th class="border border-gray-300 p-1">报修请求 ID</th>
                        <th class="border border-gray-300 p-1">维修人员</th>
                        <th class="border border-gray-300 p-1">响应时间</th>
                        <th class="border border-gray-300 p-1">操作</th>
                    </tr>
                </thead>
                <tbody id="responseRecordTable"></tbody>
            </table>
        </div>
        <!-- 评价管理 -->
        <div id="evaluation" class="tab-content hidden">
            <h2 class="text-xl font-bold mb-2">评价管理</h2>
            <input type="text" id="evaluationSearch" placeholder="搜索评价信息" oninput="searchEvaluations()" class="border border-gray-300 p-1 mb-2">
            <button class="bg-green-500 text-white p-1 rounded-md" onclick="openAddEvaluationModal()">添加评价信息</button>
            <table class="table-auto w-full">
                <thead>
                    <tr>
                        <th class="border border-gray-300 p-1">ID</th>
                        <th class="border border-gray-300 p-1">报修人</th>
                        <th class="border border-gray-300 p-1">评价内容</th>
                        <th class="border border-gray-300 p-1">操作</th>
                    </tr>
                </thead>
                <tbody id="evaluationTable"></tbody>
            </table>
        </div>
    </div>

    <!-- 报修请求添加/编辑模态框 -->
    <div id="repairRequestModal" class="fixed inset-0 bg-gray-500 bg-opacity-75 flex justify-center items-center hidden">
        <div class="bg-white p-4 rounded-md w-1/2">
            <h2 class="text-xl font-bold mb-2">添加/编辑报修请求</h2>
            <input type="hidden" id="repairRequestId">
            <label for="repairRequestFacility" class="block mb-1">设施名称</label>
            <input type="text" id="repairRequestFacility" class="border border-gray-300 p-1 mb-2 w-full">
            <label for="repairRequestReporter" class="block mb-1">报修人</label>
            <input type="text" id="repairRequestReporter" class="border border-gray-300 p-1 mb-2 w-full">
            <label for="repairRequestTime" class="block mb-1">报修时间</label>
            <input type="text" id="repairRequestTime" class="border border-gray-300 p-1 mb-2 w-full">
            <button class="bg-gray-500 text-white p-1 rounded-md mr-2" onclick="closeModal('repairRequestModal')">关闭</button>
            <button class="bg-green-500 text-white p-1 rounded-md" onclick="saveRepairRequest()">保存</button>
        </div>
    </div>
    <!-- 维修人员添加/编辑模态框 -->
    <div id="repairmanModal" class="fixed inset-0 bg-gray-500 bg-opacity-75 flex justify-center items-center hidden">
        <div class="bg-white p-4 rounded-md w-1/2">
            <h2 class="text-xl font-bold mb-2">添加/编辑维修人员</h2>
            <input type="hidden" id="repairmanId">
            <label for="repairmanName" class="block mb-1">姓名</label>
            <input type="text" id="repairmanName" class="border border-gray-300 p-1 mb-2 w-full">
            <label for="repairmanContact" class="block mb-1">联系方式</label>
            <input type="text" id="repairmanContact" class="border border-gray-300 p-1 mb-2 w-full">
            <button class="bg-gray-500 text-white p-1 rounded-md mr-2" onclick="closeModal('repairmanModal')">关闭</button>
            <button class="bg-green-500 text-white p-1 rounded-md" onclick="saveRepairman()">保存</button>
        </div>
    </div>
    <!-- 设施信息添加/编辑模态框 -->
    <div id="facilityModal" class="fixed inset-0 bg-gray-500 bg-opacity-75 flex justify-center items-center hidden">
        <div class="bg-white p-4 rounded-md w-1/2">
            <h2 class="text-xl font-bold mb-2">添加/编辑设施信息</h2>
            <input type="hidden" id="facilityId">
            <label for="facilityName" class="block mb-1">设施名称</label>
            <input type="text" id="facilityName" class="border border-gray-300 p-1 mb-2 w-full">
            <label for="facilityLocation" class="block mb-1">位置</label>
            <input type="text" id="facilityLocation" class="border border-gray-300 p-1 mb-2 w-full">
            <button class="bg-gray-500 text-white p-1 rounded-md mr-2" onclick="closeModal('facilityModal')">关闭</button>
            <button class="bg-green-500 text-white p-1 rounded-md" onclick="saveFacility()">保存</button>
        </div>
    </div>
    <!-- 响应记录添加/编辑模态框 -->
    <div id="responseRecordModal" class="fixed inset-0 bg-gray-500 bg-opacity-75 flex justify-center items-center hidden">
        <div class="bg-white p-4 rounded-md w-1/2">
            <h2 class="text-xl font-bold mb-2">添加/编辑响应记录</h2>
            <input type="hidden" id="responseRecordId">
            <label for="responseRecordRequestId" class="block mb-1">报修请求 ID</label>
            <input type="text" id="responseRecordRequestId" class="border border-gray-300 p-1 mb-2 w-full">
            <label for="responseRecordRepairman" class="block mb-1">维修人员</label>
            <input type="text" id="responseRecordRepairman" class="border border-gray-300 p-1 mb-2 w-full">
            <label for="responseRecordTime" class="block mb-1">响应时间</label>
            <input type="text" id="responseRecordTime" class="border border-gray-300 p-1 mb-2 w-full">
            <button class="bg-gray-500 text-white p-1 rounded-md mr-2" onclick="closeModal('responseRecordModal')">关闭</button>
            <button class="bg-green-500 text-white p-1 rounded-md" onclick="saveResponseRecord()">保存</button>
        </div>
    </div>
    <!-- 评价信息添加/编辑模态框 -->
    <div id="evaluationModal" class="fixed inset-0 bg-gray-500 bg-opacity-75 flex justify-center items-center hidden">
        <div class="bg-white p-4 rounded-md w-1/2">
            <h2 class="text-xl font-bold mb-2">添加/编辑评价信息</h2>
            <input type="hidden" id="evaluationId">
            <label for="evaluationReporter" class="block mb-1">报修人</label>
            <input type="text" id="evaluationReporter" class="border border-gray-300 p-1 mb-2 w-full">
            <label for="evaluationContent" class="block mb-1">评价内容</label>
            <input type="text" id="evaluationContent" class="border border-gray-300 p-1 mb-2 w-full">
            <button class="bg-gray-500 text-white p-1 rounded-md mr-2" onclick="closeModal('evaluationModal')">关闭</button>
            <button class="bg-green-500 text-white p-1 rounded-md" onclick="saveEvaluation()">保存</button>
        </div>
    </div>

    <script>
        // 初始化表格和数据
        function init() {
            initRepairRequests();
            initRepairmen();
            initFacilities();
            initResponseRecords();
            initEvaluations();
        }

        // 打开 tab 页面
        function openTab(tabName) {
            let tabContents = document.querySelectorAll('.tab-content');
            tabContents.forEach(content => {
                content.classList.add('hidden');
            });
            document.getElementById(tabName).classList.remove('hidden');
        }

        // 报修请求管理
        function initRepairRequests() {
            let repairRequests = JSON.parse(localStorage.getItem('repairRequests')) || [
                { id: 1, facility: '路灯', reporter: '张三', time: '2025-01-01' },
                { id: 2, facility: '电梯', reporter: '李四', time: '2025-01-02' },
                { id: 3, facility: '水管', reporter: '王五', time: '2025-01-03' },
                { id: 4, facility: '门窗', reporter: '赵六', time: '2025-01-04' },
                { id: 5, facility: '空调', reporter: '孙七', time: '2025-01-05' },
                { id: 6, facility: '消防设施', reporter: '周八', time: '2025-01-06' },
                { id: 7, facility: '停车场设施', reporter: '吴九', time: '2025-01-07' },
                { id: 8, facility: '健身器材', reporter: '郑十', time: '2025-01-08' },
                { id: 9, facility: '垃圾桶', reporter: '王十一', time: '2025-01-09' },
                { id: 10, facility: '门禁系统', reporter: '李十二', time: '2025-01-10' }
            ];
            localStorage.setItem('repairRequests', JSON.stringify(repairRequests));
            renderRepairRequests(repairRequests);
        }

        function renderRepairRequests(repairRequests) {
            let table = document.getElementById('repairRequestTable');
            table.innerHTML = '';
            repairRequests.forEach(request => {
                let row = table.insertRow();
                row.insertCell(0).textContent = request.id;
                row.insertCell(1).textContent = request.facility;
                row.insertCell(2).textContent = request.reporter;
                row.insertCell(3).textContent = request.time;
                let actionsCell = row.insertCell(4);
                actionsCell.innerHTML = `<button class="bg-yellow-500 text-white p-1 rounded-md mr-2" onclick="openEditRepairRequestModal(${request.id})">编辑</button>
                                         <button class="bg-red-500 text-white p-1 rounded-md" onclick="deleteRepairRequest(${request.id})">删除</button>`;
            });
        }

        function searchRepairRequests() {
            let searchTerm = document.getElementById('repairRequestSearch').value.toLowerCase();
            let repairRequests = JSON.parse(localStorage.getItem('repairRequests'));
            let filteredRequests = repairRequests.filter(request => {
                return request.facility.toLowerCase().includes(searchTerm) || request.reporter.toLowerCase().includes(searchTerm);
            });
            renderRepairRequests(filteredRequests);
        }

        function openAddRepairRequestModal() {
            document.getElementById('repairRequestId').value = '';
            document.getElementById('repairRequestFacility').value = '';
            document.getElementById('repairRequestReporter').value = '';
            document.getElementById('repairRequestTime').value = '';
            document.getElementById('repairRequestModal').classList.remove('hidden');
        }

        function openEditRepairRequestModal(id) {
            let repairRequests = JSON.parse(localStorage.getItem('repairRequests'));
            let request = repairRequests.find(r => r.id === id);
            document.getElementById('repairRequestId').value = request.id;
            document.getElementById('repairRequestFacility').value = request.facility;
            document.getElementById('repairRequestReporter').value = request.reporter;
            document.getElementById('repairRequestTime').value = request.time;
            document.getElementById('repairRequestModal').classList.remove('hidden');
        }

        function saveRepairRequest() {
            let id = document.getElementById('repairRequestId').value;
            let facility = document.getElementById('repairRequestFacility').value;
            let reporter = document.getElementById('repairRequestReporter').value;
            let time = document.getElementById('repairRequestTime').value;
            let repairRequests = JSON.parse(localStorage.getItem('repairRequests'));
            if (id) {
                let index = repairRequests.findIndex(r => r.id === parseInt(id));
                repairRequests[index] = { id: parseInt(id), facility, reporter, time };
            } else {
                let newId = repairRequests.length > 0 ? Math.max(...repairRequests.map(r => r.id)) + 1 : 1;
                repairRequests.push({ id: newId, facility, reporter, time });
            }
            localStorage.setItem('repairRequests', JSON.stringify(repairRequests));
            renderRepairRequests(repairRequests);
            closeModal('repairRequestModal');
        }

        function deleteRepairRequest(id) {
            let repairRequests = JSON.parse(localStorage.getItem('repairRequests'));
            let newRequests = repairRequests.filter(r => r.id !== id);
            localStorage.setItem('repairRequests', JSON.stringify(newRequests));
            renderRepairRequests(newRequests);
        }

        // 维修人员管理
        function initRepairmen() {
            let repairmen = JSON.parse(localStorage.getItem('repairmen')) || [
                { id: 1, name: '刘师傅', contact: '13800138000' },
                { id: 2, name: '张师傅', contact: '13900139000' },
                { id: 3, name: '王师傅', contact: '13700137000' },
                { id: 4, name: '李师傅', contact: '13600136000' },
                { id: 5, name: '赵师傅', contact: '13500135000' },
                { id: 6, name: '孙师傅', contact: '13400134000' },
                { id: 7, name: '周师傅', contact: '13300133000' },
                { id: 8, name: '吴师傅', contact: '13200132000' },
                { id: 9, name: '郑师傅', contact: '13100131000' },
                { id: 10, name: '王师傅', contact: '13000130000' }
            ];
            localStorage.setItem('repairmen', JSON.stringify(repairmen));
            renderRepairmen(repairmen);
        }

        function renderRepairmen(repairmen) {
            let table = document.getElementById('repairmanTable');
            table.innerHTML = '';
            repairmen.forEach(repairman => {
                let row = table.insertRow();
                row.insertCell(0).textContent = repairman.id;
                row.insertCell(1).textContent = repairman.name;
                row.insertCell(2).textContent = repairman.contact;
                let actionsCell = row.insertCell(3);
                actionsCell.innerHTML = `<button class="bg-yellow-500 text-white p-1 rounded-md mr-2" onclick="openEditRepairmanModal(${repairman.id})">编辑</button>
                                         <button class="bg-red-500 text-white p-1 rounded-md" onclick="deleteRepairman(${repairman.id})">删除</button>`;
            });
        }

        function searchRepairmen() {
            let searchTerm = document.getElementById('repairmanSearch').value.toLowerCase();
            let repairmen = JSON.parse(localStorage.getItem('repairmen'));
            let filteredRepairmen = repairmen.filter(repairman => {
                return repairman.name.toLowerCase().includes(searchTerm);
            });
            renderRepairmen(filteredRepairmen);
        }

        function openAddRepairmanModal() {
            document.getElementById('repairmanId').value = '';
            document.getElementById('repairmanName').value = '';
            document.getElementById('repairmanContact').value = '';
            document.getElementById('repairmanModal').classList.remove('hidden');
        }

        function openEditRepairmanModal(id) {
            let repairmen = JSON.parse(localStorage.getItem('repairmen'));
            let repairman = repairmen.find(r => r.id === id);
            document.getElementById('repairmanId').value = repairman.id;
            document.getElementById('repairmanName').value = repairman.name;
            document.getElementById('repairmanContact').value = repairman.contact;
            document.getElementById('repairmanModal').classList.remove('hidden');
        }

        function saveRepairman() {
            let id = document.getElementById('repairmanId').value;
            let name = document.getElementById('repairmanName').value;
            let contact = document.getElementById('repairmanContact').value;
            let repairmen = JSON.parse(localStorage.getItem('repairmen'));
            if (id) {
                let index = repairmen.findIndex(r => r.id === parseInt(id));
                repairmen[index] = { id: parseInt(id), name, contact };
            } else {
                let newId = repairmen.length > 0 ? Math.max(...repairmen.map(r => r.id)) + 1 : 1;
                repairmen.push({ id: newId, name, contact });
            }
            localStorage.setItem('repairmen', JSON.stringify(repairmen));
            renderRepairmen(repairmen);
            closeModal('repairmanModal');
        }

        function deleteRepairman(id) {
            let repairmen = JSON.parse(localStorage.getItem('repairmen'));
            let newRepairmen = repairmen.filter(r => r.id !== id);
            localStorage.setItem('repairmen', JSON.stringify(newRepairmen));
            renderRepairmen(newRepairmen);
        }

        // 设施信息管理
        function initFacilities() {
            let facilities = JSON.parse(localStorage.getItem('facilities')) || [
                { id: 1, name: '路灯', location: '小区道路' },
                { id: 2, name: '电梯', location: '1号楼' },
                { id: 3, name: '水管', location: '地下室' },
                { id: 4, name: '门窗', location: '2号楼301室' },
                { id: 5, name: '空调', location: '办公室' },
                { id: 6, name: '消防设施', location: '楼梯间' },
                { id: 7, name: '停车场设施', location: '地下停车场' },
                { id: 8, name: '健身器材', location: '小区广场' },
                { id: 9, name: '垃圾桶', location: '小区门口' },
                { id: 10, name: '门禁系统', location: '小区大门' }
            ];
            localStorage.setItem('facilities', JSON.stringify(facilities));
            renderFacilities(facilities);
        }

        function renderFacilities(facilities) {
            let table = document.getElementById('facilityTable');
            table.innerHTML = '';
            facilities.forEach(facility => {
                let row = table.insertRow();
                row.insertCell(0).textContent = facility.id;
                row.insertCell(1).textContent = facility.name;
                row.insertCell(2).textContent = facility.location;
                let actionsCell = row.insertCell(3);
                actionsCell.innerHTML = `<button class="bg-yellow-500 text-white p-1 rounded-md mr-2" onclick="openEditFacilityModal(${facility.id})">编辑</button>
                                         <button class="bg-red-500 text-white p-1 rounded-md" onclick="deleteFacility(${facility.id})">删除</button>`;
            });
        }

        function searchFacilities() {
            let searchTerm = document.getElementById('facilitySearch').value.toLowerCase();
            let facilities = JSON.parse(localStorage.getItem('facilities'));
            let filteredFacilities = facilities.filter(facility => {
                return facility.name.toLowerCase().includes(searchTerm) || facility.location.toLowerCase().includes(searchTerm);
            });
            renderFacilities(filteredFacilities);
        }

        function openAddFacilityModal() {
            document.getElementById('facilityId').value = '';
            document.getElementById('facilityName').value = '';
            document.getElementById('facilityLocation').value = '';
            document.getElementById('facilityModal').classList.remove('hidden');
        }

        function openEditFacilityModal(id) {
            let facilities = JSON.parse(localStorage.getItem('facilities'));
            let facility = facilities.find(f => f.id === id);
            document.getElementById('facilityId').value = facility.id;
            document.getElementById('facilityName').value = facility.name;
            document.getElementById('facilityLocation').value = facility.location;
            document.getElementById('facilityModal').classList.remove('hidden');
        }

        function saveFacility() {
            let id = document.getElementById('facilityId').value;
            let name = document.getElementById('facilityName').value;
            let location = document.getElementById('facilityLocation').value;
            let facilities = JSON.parse(localStorage.getItem('facilities'));
            if (id) {
                let index = facilities.findIndex(f => f.id === parseInt(id));
                facilities[index] = { id: parseInt(id), name, location };
            } else {
                let newId = facilities.length > 0 ? Math.max(...facilities.map(f => f.id)) + 1 : 1;
                facilities.push({ id: newId, name, location });
            }
            localStorage.setItem('facilities', JSON.stringify(facilities));
            renderFacilities(facilities);
            closeModal('facilityModal');
        }

        function deleteFacility(id) {
            let facilities = JSON.parse(localStorage.getItem('facilities'));
            let newFacilities = facilities.filter(f => f.id !== id);
            localStorage.setItem('facilities', JSON.stringify(newFacilities));
            renderFacilities(newFacilities);
        }

        // 响应记录管理
        function initResponseRecords() {
            let responseRecords = JSON.parse(localStorage.getItem('responseRecords')) || [
                { id: 1, requestId: 1, repairman: '刘师傅', time: '2025-01-01 10:00' },
                { id: 2, requestId: 2, repairman: '张师傅', time: '2025-01-02 11:00' },
                { id: 3, requestId: 3, repairman: '王师傅', time: '2025-01-03 12:00' },
                { id: 4, requestId: 4, repairman: '李师傅', time: '2025-01-04 13:00' },
                { id: 5, requestId: 5, repairman: '赵师傅', time: '2025-01-05 14:00' },
                { id: 6, requestId: 6, repairman: '孙师傅', time: '2025-01-06 15:00' },
                { id: 7, requestId: 7, repairman: '周师傅', time: '2025-01-07 16:00' },
                { id: 8, requestId: 8, repairman: '吴师傅', time: '2025-01-08 17:00' },
                { id: 9, requestId: 9, repairman: '郑师傅', time: '2025-01-09 18:00' },
                { id: 10, requestId: 10, repairman: '王师傅', time: '2025-01-10 19:00' }
            ];
            localStorage.setItem('responseRecords', JSON.stringify(responseRecords));
            renderResponseRecords(responseRecords);
        }

        function renderResponseRecords(responseRecords) {
            let table = document.getElementById('responseRecordTable');
            table.innerHTML = '';
            responseRecords.forEach(record => {
                let row = table.insertRow();
                row.insertCell(0).textContent = record.id;
                row.insertCell(1).textContent = record.requestId;
                row.insertCell(2).textContent = record.repairman;
                row.insertCell(3).textContent = record.time;
                let actionsCell = row.insertCell(4);
                actionsCell.innerHTML = `<button class="bg-yellow-500 text-white p-1 rounded-md mr-2" onclick="openEditResponseRecordModal(${record.id})">编辑</button>
                                         <button class="bg-red-500 text-white p-1 rounded-md" onclick="deleteResponseRecord(${record.id})">删除</button>`;
            });
        }

        function searchResponseRecords() {
            let searchTerm = document.getElementById('responseRecordSearch').value.toLowerCase();
            let responseRecords = JSON.parse(localStorage.getItem('responseRecords'));
            let filteredRecords = responseRecords.filter(record => {
                return record.repairman.toLowerCase().includes(searchTerm) || record.requestId.toString().includes(searchTerm);
            });
            renderResponseRecords(filteredRecords);
        }

        function openAddResponseRecordModal() {
            document.getElementById('responseRecordId').value = '';
            document.getElementById('responseRecordRequestId').value = '';
            document.getElementById('responseRecordRepairman').value = '';
            document.getElementById('responseRecordTime').value = '';
            document.getElementById('responseRecordModal').classList.remove('hidden');
        }

        function openEditResponseRecordModal(id) {
            let responseRecords = JSON.parse(localStorage.getItem('responseRecords'));
            let record = responseRecords.find(r => r.id === id);
            document.getElementById('responseRecordId').value = record.id;
            document.getElementById('responseRecordRequestId').value = record.requestId;
            document.getElementById('responseRecordRepairman').value = record.repairman;
            document.getElementById('responseRecordTime').value = record.time;
            document.getElementById('responseRecordModal').classList.remove('hidden');
        }

        function saveResponseRecord() {
            let id = document.getElementById('responseRecordId').value;
            let requestId = document.getElementById('responseRecordRequestId').value;
            let repairman = document.getElementById('responseRecordRepairman').value;
            let time = document.getElementById('responseRecordTime').value;
            let responseRecords = JSON.parse(localStorage.getItem('responseRecords'));
            if (id) {
                let index = responseRecords.findIndex(r => r.id === parseInt(id));
                responseRecords[index] = { id: parseInt(id), requestId: parseInt(requestId), repairman, time };
            } else {
                let newId = responseRecords.length > 0 ? Math.max(...responseRecords.map(r => r.id)) + 1 : 1;
                responseRecords.push({ id: newId, requestId: parseInt(requestId), repairman, time });
            }
            localStorage.setItem('responseRecords', JSON.stringify(responseRecords));
            renderResponseRecords(responseRecords);
            closeModal('responseRecordModal');
        }

        function deleteResponseRecord(id) {
            let responseRecords = JSON.parse(localStorage.getItem('responseRecords'));
            let newRecords = responseRecords.filter(r => r.id !== id);
            localStorage.setItem('responseRecords', JSON.stringify(newRecords));
            renderResponseRecords(newRecords);
        }

        // 评价管理
        function initEvaluations() {
            let evaluations = JSON.parse(localStorage.getItem('evaluations')) || [
                { id: 1, reporter: '张三', content: '维修及时' },
                { id: 2, reporter: '李四', content: '技术精湛' },
                { id: 3, reporter: '王五', content: '服务态度好' },
                { id: 4, reporter: '赵六', content: '效率高' },
                { id: 5, reporter: '孙七', content: '解决问题能力强' },
                { id: 6, reporter: '周八', content: '责任心强' },
                { id: 7, reporter: '吴九', content: '沟通顺畅' },
                { id: 8, reporter: '郑十', content: '值得信赖' },
                { id: 9, reporter: '王十一', content: '维修质量高' },
                { id: 10, reporter: '李十二', content: '非常满意' }
            ];
            localStorage.setItem('evaluations', JSON.stringify(evaluations));
            renderEvaluations(evaluations);
        }

        function renderEvaluations(evaluations) {
            let table = document.getElementById('evaluationTable');
            table.innerHTML = '';
            evaluations.forEach(evaluation => {
                let row = table.insertRow();
                row.insertCell(0).textContent = evaluation.id;
                row.insertCell(1).textContent = evaluation.reporter;
                row.insertCell(2).textContent = evaluation.content;
                let actionsCell = row.insertCell(3);
                actionsCell.innerHTML = `<button class="bg-yellow-500 text-white p-1 rounded-md mr-2" onclick="openEditEvaluationModal(${evaluation.id})">编辑</button>
                                         <button class="bg-red-500 text-white p-1 rounded-md" onclick="deleteEvaluation(${evaluation.id})">删除</button>`;
            });
        }

        function searchEvaluations() {
            let searchTerm = document.getElementById('evaluationSearch').value.toLowerCase();
            let evaluations = JSON.parse(localStorage.getItem('evaluations'));
            let filteredEvaluations = evaluations.filter(evaluation => {
                return evaluation.reporter.toLowerCase().includes(searchTerm) || evaluation.content.toLowerCase().includes(searchTerm);
            });
            renderEvaluations(filteredEvaluations);
        }

        function openAddEvaluationModal() {
            document.getElementById('evaluationId').value = '';
            document.getElementById('evaluationReporter').value = '';
            document.getElementById('evaluationContent').value = '';
            document.getElementById('evaluationModal').classList.remove('hidden');
        }

        function openEditEvaluationModal(id) {
            let evaluations = JSON.parse(localStorage.getItem('evaluations'));
            let evaluation = evaluations.find(e => e.id === id);
            document.getElementById('evaluationId').value = evaluation.id;
            document.getElementById('evaluationReporter').value = evaluation.reporter;
            document.getElementById('evaluationContent').value = evaluation.content;
            document.getElementById('evaluationModal').classList.remove('hidden');
        }

        function saveEvaluation() {
            let id = document.getElementById('evaluationId').value;
            let reporter = document.getElementById('evaluationReporter').value;
            let content = document.getElementById('evaluationContent').value;
            let evaluations = JSON.parse(localStorage.getItem('evaluations'));
            if (id) {
                let index = evaluations.findIndex(e => e.id === parseInt(id));
                evaluations[index] = { id: parseInt(id), reporter, content };
            } else {
                let newId = evaluations.length > 0 ? Math.max(...evaluations.map(e => e.id)) + 1 : 1;
                evaluations.push({ id: newId, reporter, content });
            }
            localStorage.setItem('evaluations', JSON.stringify(evaluations));
            renderEvaluations(evaluations);
            closeModal('evaluationModal');
        }

        function deleteEvaluation(id) {
            let evaluations = JSON.parse(localStorage.getItem('evaluations'));
            let newEvaluations = evaluations.filter(e => e.id !== id);
            localStorage.setItem('evaluations', JSON.stringify(newEvaluations));
            renderEvaluations(newEvaluations);
        }

        function closeModal(modalId) {
            document.getElementById(modalId).classList.add('hidden');
        }

        window.onload = init;
    </script>
</body>

</html>